<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <title>修改密码</title>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
  <link rel="stylesheet" href="../../layuimini/lib/layui-v2.5.5/css/layui.css" media="all" />
  <link rel="stylesheet" href="../../layuimini/css/public.css" media="all" />

  <style>
    .password_form {
      width: 100%;
    }
  </style>
</head>

<body>
  <script type="text/html" id="edit_user_pass">
      <div class="layuimini-container">
        <div class="layuimini-main">
          <div class="layui-form layuimini-form password_form">
            <div class="layui-form-item">
              <label class="layui-form-label required">旧密码</label>
              <div class="layui-input-block">
                <input
                  type="password"
                  name="old_password"
                  lay-verify="required"
                  placeholder="旧密码"
                  value=""
                  lay-verType="tips"
                  class="layui-input"
                />
                <tip style="color:orange;font-size: 13;"
                  >填写账号的旧的密码。</tip
                >
              </div>
            </div>

            <div class="layui-form-item">
              <label class="layui-form-label required">新密码</label>
              <div class="layui-input-block">
                <input
                  type="password"
                  name="new_password"
                  lay-verify="required"
                  placeholder="新密码"
                  value=""
                  lay-verType="tips"
                  class="layui-input"
                />
              </div>
            </div>
            <div class="layui-form-item">
              <label class="layui-form-label required">确认新密码</label>
              <div class="layui-input-block">
                <input
                  type="password"
                  name="again_password"
                  lay-verify="required"
                  placeholder="确认新密码"
                  value=""
                  lay-verType="tips"
                  class="layui-input"
                />
              </div>
            </div>

            <div class="layui-form-item">
              <div class="layui-input-block">
                <button
                  class="layui-btn layui-btn-normal"
                  lay-submit
                  lay-filter="edit"
                >
                  提交
                </button>
              </div>
            </div>
          </div>
        </div>
      </div>
    </script>

  <script src="../../layuimini/lib/layui-v2.5.5/layui.js" charset="utf-8"></script>
  <script src="../../layuimini/js/lay-config.js" charset="utf-8"></script>
</body>

<script>
  layui.use(["layer", "form", "common", "miniTab"], function (args) {
    var layer = layui.layer,
      common = layui.common,
      form = layui.form,
      miniTab = layui.miniTab,
      $ = layui.jquery;

    // 提交

    form.on("submit(edit)", function (data) {
      console.log(data.field);
      var user = JSON.parse(JSON.stringify(data.field));
      if (!user) {
        return;
      }
      // 两次输入的新密码不一致，不能提交
      if (user.new_password != user.again_password) {
        layer.msg("两次输入的新密码不一致", { offset: ["50%", "70%"] });
        return;
      }
      if (user.new_password.length < 4 || user.again_password.length < 4) {
        layer.msg("新密码长度不能少于4位", { offset: ["50%", "70%"] });
        return;
      }

      // 提交
      var param = {};
      param.oldPassword = data.field.old_password;
      param.newPassword = data.field.new_password;

      common.ajax(
        common.api + "/user/update/password",
        JSON.stringify(param),
        function (res) {
          if (res.code === 200) {
            layer.msg(
              res.msg + "，请重新登录",
              { offset: ["50%", "70%"] },
              function () {
                window.location.href = "/login.html";
              }
            );
          } else {
            layer.msg(res.msg, { offset: ["50%", "70%"] });
          }
        },
        "put",
        function (data) {
          layer.msg(data.msg, { offset: ["50%", "70%"] });
        }
      );
      return false;
    });

    layer.ready(function () {
      layer.open({
        type: 1,
        title: "修改密码",
        offset: "r",
        anim: "slideLeft", // 从右往左
        area: ["50%", "100%"],
        shade: 0.1,
        shadeClose: true,
        id: "Id__edit_pass",
        content: $("#edit_user_pass").html(),
      });
    });
  });
</script>

</html>